import styled from 'styled-components'

export const PaginationWrapper = styled.div`
	display: flex;
	flex-direction: column;
	align-items: center;

	.pagination {
		display: flex;
		flex-direction: column;
		align-items: center;

		.info {
			margin: 10px 0;
			font-style: 14px;
			color: #222;
		}
	}

	.MuiPaginationItem-icon {
		font-size: 24px;
	}

	.MuiPaginationItem-page {
		margin: 0 8px;

		&:hover {
			text-decoration: underline;
		}
	}

	.MuiPaginationItem-page.Mui-selected {
		background-color: #222;
		color: #fff;

		&:hover {
			background-color: #222;
		}
	}

	.footer {
		margin-top: 30px;
		color: #717171;
	}
`
